/*
 * Copyright (c) 2015 JKD TEAM (9koudai.net)
 * @Author: fcdcyy@sina.cn
 * @DateTime: 2015-04-17 08:56:26
 */


@charset "utf-8";

$color: #ff000a;   //主体颜色
$bg: #272727;      //主要背景
$lcolor: #005ea7;   //链接颜色
$radius: .2em;

//字体方法
@mixin fz($size: .8em){
  font-size: $size;
}
//圆角方法
@mixin radius($radius: 10px) {
　-webkit-border-radius: $radius;
　-moz-border-radius: $radius;
　-ms-border-radius: $radius;
　-o-border-radius: $radius;
　border-radius: $radius;
}
//外边距
@mixin margin($margin: 10px){
  margin: $margin;
}
//内边距
@mixin padding($padding: 10px){
  padding: $padding;
}
//文字对齐方式
@mixin align($align: center){
  text-align:$align;
}
//单边边框方法
@mixin bor($dt, $ct: #e8e8e8){
  border-#{$dt}: 1px solid $ct;
}
//全边框方法
@mixin border($ct: #e8e8e8){
  border: 1px solid $ct;
}
//三角形
@mixin tri($dire,$dc,$width){
  width: 0;
  height: 0;
  line-height: 0;
  border: $width solid transparent;
  border-#{$dire}-color: $dc;
}
//css3过渡效果
@mixin transit($time: 1s, $type: all, $timing: ease){
  -webkit-transition: $time $type $timing;
  -moz-transition: $time $type $timing;
  -ms-transition: $time $type $timing;
  -o-transition: $time $type $timing;
  transition: $time $type $timing;
}







html, body, div, ul, ol, li, p, h2, h3, h4, span, input, textarea, select, option, table, tr, td, dd, dt, blockquote {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

body {
  @extend %ffyh;
  width: 100%;
  height: 100%;
  overflow: hidden;
  min-width: 320px;
  color: #000;
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;/*
  font:400 14px/1.5 Arial,"Lucida Grande",Verdana,"Microsoft YaHei",hei; */
}

img {
  border: none;
  display: block;
  width: 100%;
  height: auto;
}

ul, li {
  list-style-type: none;
}

i, em {
  font-style: normal;
}

input,button {
  -webkit-appearance: none;
  border-radius: 0;
  box-sizing: border-box;
  outline: none;
}

a {
  text-decoration: none;
  color: #000;
}

.clear {
  display: block;
  overflow: hidden;
  clear: both;
  height: 0;
  line-height: 0;
  font-size: 0;
}

.clearfix {
  &:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }
  zoom: 1;
}

.pr{
  position: relative;
}

.pa{
  position: absolute;
}

.fl{
  float: left;
}

.fr{
  float: right;
}

.bg{
  background: #eee;
}




/****iconfont****/
@font-face {
  font-family: 'iconfont';
  src: url('../fonts/iconfont.eot');
  src: url('../fonts/iconfont.eot?#iefix') format("embedded-opentype"), url('../fonts/iconfont.woff') format("woff"), url('../fonts/iconfont.ttf') format("truetype"), url('../fonts/iconfont.svg#uxiconfont') format("svg");
}


.iconfont {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}

/* header
----------------------------------------------------------*/

.header {
  width: 100%;
  height: 3.2em;
  z-index: 99;
  line-height: 3.2em;
  position: relative;
  color: #333;
  background: #fff;
  a{
    color: $color;
  }
}

.logo {
  // width: 18%;
  height: 100%;
  padding: .2em 0;
  margin: 0 0 0 2%;
  color: $color;
  font-family: "黑体";
  @extend %fl;
  img{
    width: auto;
    height: 100%;
  }
}

.search{
  @extend %fr,%pr;
  width: 55%;
  margin: 0 2% 0 0;
  padding-top: .6em;
  .txt{
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 2em;
    background: #fff;
    @include border;
    -webkit-border-radius: $radius;
  　-moz-border-radius: $radius;
  　-ms-border-radius: $radius;
  　-o-border-radius: $radius;
  　border-radius: $radius;
    padding-left: .5em;
  }
  .sub{
    @extend %pa;
    right: 0;
    top: 0;
    border: none;
    background: none;
    width: 16%;
    height: 2em;
    margin-top: .6em;
    color: $color;
    font-weight: bold;
  }
}

.back{
  @extend %fl;
  @include align;
  width: 10%;
  a{
    display: block;
    width: 100%;
    color: $color;
    @include fz(1.4em);
    line-height: 2.2;
  }
}

.htit{
  @extend %fl;
  width: 80%;
  @include align;
  height: 3.2em;
  overflow: hidden;
  i{
    @include fz(1.2em);
  }
}

.hcate{
  @extend %fr;
  @include align;
  width: 10%;
  a{
    @include fz(1.4em);
  }
}


/*焦点图*/

.slideBox {
  position: relative;
  overflow: hidden;
  .bd {
    position: relative;
    z-index: 0;
    li {
      position: relative;
      text-align: center;
      img {
        background: url(../images/loading.gif) center center no-repeat;
        vertical-align: top;
        width: 100%;
        /* 图片宽度100%，达到自适应效果 */
      }
      a {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      }
      .tit {
        display: block;
        width: 100%;
        position: absolute;
        bottom: 0;
        text-indent: 10px;
        height: 28px;
        line-height: 28px;
        color: #fff;
        text-align: left;
      }
    }
  }
  .hd {
    position: absolute;
    width: 100%;
    height: 1.5em;
    padding-top: .3em;
    bottom: 0;
    z-index: 1;
    text-align: center;
    li {
      display: inline-block;
      width: .6em;
      height: .6em;
      background: #ccc;
      border-radius: 50%;
      line-height: 2;
      overflow: hidden;
      margin: 0 .3em;
      cursor: pointer;
      color: #fff;
      &.on {
        background: $color;
        color: #5d7895;
      }
    }
  }
  .prev, .next {
    position: absolute;
    left: 1em;
    top: 0;
    display: block;
    width: 3%;
    height: 100%;
    text-align: center;
  }
  .prev {
    background: url(../images/arrow_l.png) 50% no-repeat;
    background-size: 100% auto;
  }
  .next {
    background: url(../images/arrow_r.png) 50% no-repeat;
    background-size: 100% auto;
    left: auto;
    right: 1em;
  }
}


/* 去掉链接触摸高亮 */

/* content
----------------------------------------------------------*/

.content {
  color: #333;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
}

.main1 {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: auto;
  overflow-x: hidden;
  line-height: 1.8em;
  text-align: left;
  -webkit-overflow-scrolling: touch;
}

/* footer
----------------------------------------------------------*/

.footer {
  width: 100%;
  color: #999;
  a{
    color: #999;
  }
}

.footer_t{
  @extend %clearfix;
  width: 94%;
  margin: auto;
  line-height: 3em;
  @include bor(top);
  @include bor(bottom);
}

.footer_l{
  @extend %fl;
  margin-left: .8em;
}

.footer_r{
  @extend %fr;
  margin-right: .8em;
}

.footer_b{
  @include align;
  padding: .5em 0;
  i{
    color: $color;
    @include fz(1.2em);
  }
}

.f_rota {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  transform: rotate(90deg);
}

.footer_on {

}

/*.footer_bl{border-left: 1px solid #6b86a7;}*/

.copy {
  color: #312e2c;
  text-align: center;
  padding: 1em 0;
  line-height: 1.6em;
  i {
    color: #999;
    font-size: .8em;
  }
}

.main {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.paging{
  @include align;
  margin-top: 1.5em;
  margin-bottom: .5em;
  a,span{
    display: inline-block;
    background: #fff;
    padding: 0 .6em;
    margin: 0 .2em;
    @include border;
    color: #333;
  }
  span{
    background: #eee;
    border: none;
    color: #333;
  }
}


#layer{
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0,0,0,.5);
  z-index: 9999;
}
#layer span{
  position: fixed;
  left: 50%;
  top: 50%;
  z-index: 2100;
  border-radius: 5px;
  padding: 10px 15px;
  background: rgba(0,0,0,.7);
  color: #fff;
  font-family: Arial;
  font-weight: bold;
  font-size: 12px;
  display: block;
}

.plug-phone{
  position: fixed;
  bottom: .5em;
  left: .5em;
  z-index: 999;
}
.plug-menu{
  -webkit-appearance:button;
  -moz-appearance:button;
  appearance:button;
  display:inline-block;
  width:3em;
  height:3em;
  position: absolute;
  bottom:10px;
  left: 10px;
  z-index:999;
  background: url(../images/icon_11.png) no-repeat;
  background-size: 100% auto;
  -webkit-transition: -webkit-transform 200ms;
  -moz-transition: -moz-transform 200ms;
  transition: transform 200ms;
  -webkit-transform:rotate(1deg);
  -moz-transform:rotate(1deg);
  transform:rotate(1deg);
  color:#fff;
}
.plug-menu:before{
  margin:9px 0 0 9px;
}
.plug-menu:checked{
  -webkit-transform:scale(0.9);
  -moz-transform:scale(0.9);
  transform:scale(0.9);
  background-image: url(../images/icon_12.png);

}
.plug-bg{
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 888;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: .3;
  filter: alpha(opacity=30);
}

.plug-phone>div {
  width:32px;
  height:32px;
  border-radius:32px;
  -moz-box-shadow:0 0 0 3px #FFFFFF, 0 2px 5px 3px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow:0 0 0 3px #FFFFFF, 0 2px 5px 3px rgba(0, 0, 0, 0.25);
  box-shadow:0 0 0 3px #FFFFFF, 0 2px 5px 3px rgba(0, 0, 0, 0.25);
  background:#ff2b29;
  position:absolute;
  bottom:0;
  left:0;
  margin-bottom:20px;
  margin-left:20px;
  z-index:900;
  -webkit-transition: -webkit-transform 200ms;
  -moz-transition: -moz-transform 200ms;
  transition: transform 200ms;
}
.plug-phone>div a{
  color:#fff;
  font-size:20px;
  display: block;
  height: 100%;
  line-height: 33px;
  text-align: center;
}
.plug-phone>div.on{
  &:nth-of-type(1) {
    -webkit-transform: translate(0, -100px) rotate(720deg);
    -moz-transform: translate(0, -100px) rotate(720deg);
    transform: translate(0, -100px) rotate(720deg);
  }
  &:nth-of-type(2) {
    -webkit-transform: translate(47px, -81px) rotate(720deg);
    -moz-transform: translate(47px, -81px) rotate(720deg);
    transform: translate(47px, -81px) rotate(720deg);
  }
  &:nth-of-type(3) {
    -webkit-transform: translate(81px, -45px) rotate(720deg);
    -moz-transform: translate(81px, -45px) rotate(720deg);
    transform: translate(81px, -45px) rotate(720deg);
  }
  &:nth-of-type(4) {
    -webkit-transform: translate(100px, 0) rotate(720deg);
    -moz-transform: translate(100px, 0) rotate(720deg);
    transform: translate(100px, 0) rotate(720deg);
  }
}


@media screen and (min-width: 360px) {
  body, input, select {
    font-size: 15.75px;
  }
}

@media screen and (min-width: 400px) {
  body, input, select {
    font-size: 17.5px;
  }
}

@media screen and (min-width: 480px) {
  body, input, select {
    font-size: 21px;
  }
}

@media screen and (min-width: 560px) {
  body, input, select {
    font-size: 24.5px;
  }
}

@media screen and (min-width: 600px) {
  body, input, select {
    font-size: 26.25px;
  }
}

@media screen and (min-width: 640px) {
  body, input, select {
    font-size: 28px;
  }
}




%ffst{  //宋体
  font-family: SimSun;
}
%ffht{  //黑体
  font-family: SimHei;
}
%ffyh{  //微软雅黑
  font-family: Microsoft yahei;
}
%ffkt{   //楷体
  font-family: KaiTi;
}
%icon{  //图标集
  background: url(../images/icon.png) no-repeat;
}
%w100{  //图片自适应
  width: 100%;
}
%nowrap{  //单行文字
  white-space: nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
%inline{  //行内元素
  display:inline-block;
  *display:inline;
  zoom:1;
}
%center{   //水平居中
  max-width: 640px;
  margin: auto;
}

%clearfix {
  &:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }
  zoom: 1;
}

%fl{
  float: left;
}
%fr{
  float: right;
}
%pr{
  position: relative;
}
%pa{
  position: absolute;
}
%apr{
  -webkit-appearance: none;
  appearance: none;
}